<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>菲悠策科技</title>
<link rel='icon' href='/skin/images/pic.ico' type=‘image/x-icon’ />
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta content="telephone=no" name="format-detection" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="renderer" content="webkit">
<!--360默认急速模式打开-->
<meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no">
<link rel="stylesheet" href="/skin/css/cui.css" />
<link rel="stylesheet" href="/skin/css/style.css" />
<link rel="stylesheet" href="/skin/css/less.css" />
</head>
<body>
<body>
<div id="hd">
  <div class="wp">
    <div class="logo"><a href="/"><img src="/skin/images/guanwanglogo.png" alt=""></a></div>
    <div id="nav">
      <ul>
        
        <li><a href='/a/kehuanli/'>客户案例</a></li>
        <li><a href='/a/fuwuxiangmu/'  class='mycur'><span>服务项目</span></a></li>
        <li><a href='/a/guanyuwomen/'>关于我们</a></li>
        <li><a href='/a/lianxiwomen/'>联系我们</a></li>
        
      </ul>
    </div>
    <div class="tel">0571-86926263</div>
  </div>
</div>
<!-- end #hd -->
<div class="c"></div>
<div id="m-hd"> <a href="/" class="m-logo"><img src="/skin/images/guanwanglogo.png" alt=""></a>
  <div class="m-trigger"></div>
  <ul class="m-nav">
    <li><a href="/" class="v1">首页 </a></li>
    
    <li><a href='/a/kehuanli/' class="v1">客户案例</a></li>
    <li><a href='/a/fuwuxiangmu/'  class='v1'><span>服务项目</span></a></li>
    <li><a href='/a/guanyuwomen/' class="v1">关于我们</a></li>
    <li><a href='/a/lianxiwomen/' class="v1">联系我们</a></li>
    
  </ul>
</div>

<div class="c"></div>
<div id="bd">
  <div id="ban-in" style="background-image:url(/skin/images/14415956565984.jpg)">
    <div class="ban-bg"></div>
  </div>
  <div class="wp" id="webbuit">
    <div class="tit-i">
      <h3>网站建设</h3>
      <h5>webset <span>design</span></h5>
    </div>
    <div class="about-info">
      <p> 我们专注于品质化高端网站构建，<span>企业品牌在网站中的整体树立，网络互动的体验，以及在手机等移动端的优质呈现。</span> </p>
      <p> <span style="line-height:1.5;">根据客户实际情况1对1的为您提供咨询、研究、分析、策划等服务，从而保障网站建设项目能够顺利达到并超出您预期的商业</span><span style="line-height:1.5;">目标。</span> </p>
      <p> 我们专业提供一站式服务，从网站品牌规划、交互设计、视觉设计、动效创意，到程序开发，运营维护。 </p>
      <p> <br />
      </p>
      <p> <br />
      </p>
    </div>
    <ul class="ul-webset pr ul-show">
      <li class="li1">
        <div class="block"> <img src="/skin/images/w1.png" alt=""> <img src="/skin/images/w2.png" alt=""> <img src="/skin/images/w3.png" alt=""> <img src="/skin/images/w4.png" alt=""> <img src="/skin/images/w5.png" alt=""> <img src="/skin/images/w6.png" alt=""> <img src="/skin/images/w7.png" alt=""> <img src="/skin/images/w8.png" alt=""> <img src="/skin/images/w9.png" alt=""> </div>
        <h3>集团网站定制</h3>
        <a href="javascript:;" class="btn"></a>
        <div class="webset-pop">
          <div class="pad">
            <h2>集团网站建设<a href="javascript:void(0);" class="close"></a></h2>
            <div class="txt">
              <h4 class="tit-web">建设</h4>
              <dl class="ul-txt1">
                <dd>集团形象展示平台</dd>
                <dd>舆论资讯传播平台</dd>
                <dd>产业合作推介平台</dd>
                <dd>品牌文化塑造平台</dd>
                <dd>人力资源服务平台</dd>
                <dd>投资者沟通平台</dd>
              </dl>
            </div>
            <div class="txt">
              <h4 class="tit-web tit-web1">运维</h4>
              <dl class="ul-txt1">
                <dd>分级权限管理</dd>
                <dd>审批审核机制</dd>
                <dd>数据分析应用</dd>
                <dd>程序功能拓展</dd>
                <dd>安全运行机制</dd>
              </dl>
            </div>
            <div class="txt txt1">
              <h4 class="tit-web tit-web2">策略</h4>
              <ul class="ul-txt">
                <li class="ok">
                  <h5><a href="javascript:void(0);">网站导航</a></h5>
                  <div class="txt-1">
                    <p>良好的用户导航：信息架构的梳理应该符合企业品牌宣传与产品营销的需要；不需要让客户过多思考，全面的导航设置以适应网站不同用户对信息架构的预测，为来访者提供全程的访问导航。</p>
                  </div>
                </li>
                <li >
                  <h5><a href="javascript:void(0);">色彩搭配</a></h5>
                  <div class="txt-1">
                    <p>页面传达品牌理念：追求美观、大方、简洁的设计风格；有效传递品牌价格，展现企业形象；秉承“UCD—以用户为中心的设计”原则。</p>
                  </div>
                </li>
                <li >
                  <h5><a href="javascript:void(0);">综合分析</a></h5>
                  <div class="txt-1">
                    <p>有效的传递信息：对网站页面内容有效规划，第一时间将有效信息传达给目标受众；内容展现考虑用户体验，帮助访问者加强对品牌和产品信息的认知。</p>
                  </div>
                </li>
                <li >
                  <h5><a href="javascript:void(0);">技术运用</a></h5>
                  <div class="txt-1">
                    <p>提高互动性和可能性：利用Web2.0技术增强网站浏览体验，提高信息获取效率，增加更多对用户的个性化服务。</p>
                  </div>
                </li>
              </ul>
            </div>
          </div>
        </div>
      </li>
      <li class="li2">
        <div class="block"> <img src="/skin/images/q1.png" alt=""> <img src="/skin/images/q2.png" alt=""> <img src="/skin/images/q3.png" alt=""> <img src="/skin/images/q4.png" alt=""> <img src="/skin/images/q5.png" alt=""> <img src="/skin/images/q6.png" alt=""> </div>
        <h3>企业网站定制</h3>
        <a href="javascript:void(0);" class="btn"></a>
        <div class="webset-pop">
          <h2>企业网站定制<a href="javascript:void(0);" class="close"></a></h2>
          <div class="txt">
            <h4 class="tit-web">建设</h4>
            <dl class="ul-txt1">
              <dd>域名 主机 备案</dd>
              <dd>栏目架构全面 重点突出</dd>
              <dd>内容深度美化处理</dd>
              <dd>用户体验友好</dd>
              <dd>后台易操作 可拓展</dd>
            </dl>
          </div>
          <div class="txt">
            <h4 class="tit-web tit-web1">运维</h4>
            <dl class="ul-txt1">
              <dd>无处不在的在线沟通</dd>
              <dd>兼容性、安全性、命名规范</dd>
              <dd>自然排名与收录</dd>
              <dd>快捷操作、分享概念</dd>
              <dd>数据反馈与统计分析</dd>
            </dl>
          </div>
          <div class="txt txt1">
            <h4 class="tit-web tit-web2">策略</h4>
            <ul class="ul-txt">
              <li class="ok">
                <h5><a href="javascript:void(0);">技术运用</a></h5>
                <div class="txt-1">
                  <p>提高互动性和可能性：利用Web2.0技术增强网站浏览体验，提高信息获取效率，增加更多对用户的个性化服务。</p>
                </div>
              </li>
              <li >
                <h5><a href="javascript:void(0);">综合分析</a></h5>
                <div class="txt-1">
                  <p>有效的传递信息：对网站页面内容有效规划，第一时间将有效信息传达给目标受众；内容展现考虑用户体验，帮助访问者加强对品牌和产品信息的认知。</p>
                </div>
              </li>
              <li >
                <h5><a href="javascript:void(0);">色彩搭配</a></h5>
                <div class="txt-1">
                  <p>页面传达品牌理念：追求美观、大方、简洁的设计风格；有效传递品牌价格，展现企业形象；秉承“UCD—以用户为中心的设计”原则。</p>
                </div>
              </li>
              <li >
                <h5><a href="javascript:void(0);">网站导航</a></h5>
                <div class="txt-1">
                  <p>良好的用户导航：信息架构的梳理应该符合企业品牌宣传与产品营销的需要；不需要让客户过多思考，全面的导航设置以适应网站不同用户对信息架构的预测，为来访者提供全程的访问导航。</p>
                </div>
              </li>
            </ul>
          </div>
        </div>
      </li>
      <li class="li3">
        <div class="block"> <img src="/skin/images/d1.png" alt=""> <img src="/skin/images/d2.png" alt=""> <img src="/skin/images/d3.png" alt=""> <img src="/skin/images/d4.png" alt=""> <img src="/skin/images/d5.png" alt=""> <img src="/skin/images/d6.png" alt=""> <img src="/skin/images/d7.png" alt=""> <img src="/skin/images/d8.png" alt=""> <img src="/skin/images/d9.png" alt=""> <img src="/skin/images/d10.png" alt=""> <img src="/skin/images/d11.png" alt=""> <img src="/skin/images/d12.png" alt=""> <img src="/skin/images/d13.png" alt=""> <img src="/skin/images/d14.png" alt=""> </div>
        <h3>电子商务网站定制</h3>
        <a href="javascript:void(0);" class="btn"></a>
        <div class="webset-pop">
          <h2>电商网站定制<a href="javascript:void(0);" class="close"></a></h2>
          <div class="txt">
            <h4 class="tit-web">建设</h4>
            <dl class="ul-txt1">
              <dd>产品管理系统</dd>
              <dd>会员系统</dd>
              <dd>购物车系统</dd>
              <dd>在线支付系统</dd>
              <dd>订单管理系统</dd>
            </dl>
          </div>
          <div class="txt">
            <h4 class="tit-web tit-web1">运维</h4>
            <dl class="ul-txt1">
              <dd>接口集成性</dd>
              <dd>可扩展</dd>
              <dd>用户体验友好</dd>
              <dd>安全运行机制</dd>
              <dd>维护便捷</dd>
            </dl>
          </div>
          <div class="txt txt1">
            <h4 class="tit-web tit-web2">策略</h4>
            <ul class="ul-txt">
              <li class="ok">
                <h5><a href="javascript:void(0);">网站导航</a></h5>
                <div class="txt-1">
                  <p>良好的用户导航：信息架构的梳理应该符合企业品牌宣传与产品营销的需要；不需要让客户过多思考，全面的导航设置以适应网站不同用户对信息架构的预测，为来访者提供全程的访问导航。</p>
                </div>
              </li>
              <li >
                <h5><a href="javascript:void(0);">色彩搭配</a></h5>
                <div class="txt-1">
                  <p>页面传达品牌理念：追求美观、大方、简洁的设计风格；有效传递品牌价格，展现企业形象；秉承“UCD—以用户为中心的设计”原则。</p>
                </div>
              </li>
              <li >
                <h5><a href="javascript:void(0);">综合分析</a></h5>
                <div class="txt-1">
                  <p>提供专业的电子商务解决方案。从集成简单购物车和结算功能的小型电子商务系统，到客户订制的大型复杂电子商务平台。</p>
                </div>
              </li>
              <li >
                <h5><a href="javascript:void(0);">技术运用</a></h5>
                <div class="txt-1">
                  <p>提高互动性和可能性：利用Web2.0技术增强网站浏览体验，提高信息获取效率，增加更多对用户的个性化服务。</p>
                </div>
              </li>
            </ul>
          </div>
        </div>
      </li>
    </ul>
    <div class="h50"></div>
  </div>
  <div class="c"></div>
  <div class="bg-blue fix" id="weiweb">
    <div class="wp">
      <div class="tit-i">
        <h3>H5响应式 交互网站</h3>
        <h5><span>Responsive</span> Web design</h5>
      </div>
      <div class="about-info">
        <p> 以视觉形象为主，精细而恰当的交互动效，通过Flash、html5特效、视频等先进技术来实现，突出品牌及产品特点和形象，让用户获得耳目一新的视听效果，带来更愉悦的用户体验，传达更具魅力、印象更加深刻。 </p>
      </div>
      <ul class="ul-web fix">
        <li class="li1">
          <div class="block"> <img src="/skin/images/n1.png" alt=""> <img src="/skin/images/n2.png" alt=""> <img src="/skin/images/n3.png" alt=""> <img src="/skin/images/n4.png" alt=""> </div>
          <h3>丰富的内容设计</h3>
        </li>
        <li class="li2">
          <div class="block"> <img src="/skin/images/n5.png" alt=""> <img src="/skin/images/n6.png" alt=""> </div>
          <h3>html5页面代码</h3>
        </li>
        <li class="li3">
          <div class="block"> <img src="/skin/images/n7.png" alt=""> <img src="/skin/images/n8.png" alt=""> <img src="/skin/images/n9.png" alt=""> <img src="/skin/images/n10.png" alt=""> <img src="/skin/images/n11.png" alt=""> <img src="/skin/images/n12.png" alt=""> </div>
          <h3>css3特效样式</h3>
        </li>
        <li class="li4">
          <div class="block"> <img src="/skin/images/n13.png" alt=""> <img src="/skin/images/n14.png" alt=""> </div>
          <h3>H5响应式 交换网站</h3>
        </li>
      </ul>
      <!-- <img src="/skin/images/img18.png" alt=""> --> 
    </div>
  </div>
  <div class="wp" id="webmobel">
    <div class="tit-i">
      <h3>APP定制&移动端&微网站定制</h3>
      <h5>website about <span>mobilephone</span></h5>
    </div>
    <div class="about-info">
      <p> 在移动互联时代，我们得出“简单使用，精彩体验”的移动应用开发理念，创造属于无线时代的精彩互联。 </p>
    </div>
    <div class="c"></div>
    <div class="web-con pr">
      <ul class="ul-tab TAB_CLICK_SLIDE" id=".tab-show">
        <li class="hover"><a href="javascript:void(0);">
          <h3>APP定制开发</h3>
          <span>IOS&Android</span></a></li>
        <li><a href="javascript:void(0);">
          <h3>手机网站</h3>
          <span>Mobile web site</span></a></li>
        <li ><a href="javascript:void(0);">
          <h3>微网站</h3>
          <span>Micro website</span></a></li>
        <li ><a href="javascript:void(0);">
          <h3>微信应用开发</h3>
          <span>WeChat application</span></a></li>
      </ul>
      <div class="shou"><img src="/skin/images/shou.png" alt=""></div>
      <div class="tab-con-box">
         <div class="tab-show ">
          <div class="tab-con">
            <div data-animate="fadeInDown" class="txt animated">
              <p>APP的使用群体非常广泛，个人购物、企业办公、日常生活服务的方方面面都可以体现在APP当中很大程度上丰富了人们的日常生活，带人们走向移动互联网+的大时代。</p>
              <ul class="ul-icon">
                <li><b></b><span>IOS</span></li>
                <li><b></b><span>Android</span></li>
                <li><b></b><span>全兼容手机</span></li>
              </ul>
            </div>
          </div>
        </div>
        <div class="tab-show ">
          <div class="tab-con">
            <div data-animate="fadeInDown" class="txt animated">
              <p>手机网站适应手机浏览的网站。通过手机上的浏览器，输入网址，就可以浏览；由于手机的屏幕尺寸和CPU处理能力有限，专门为手机进行优化的网站更为方便用户浏览。</p>
              <ul class="ul-icon">
                <li><b></b><span>移动交互体验</span></li>
                <li><b></b><span>与PC数据同步</span></li>
                <li><b></b><span>全兼容手机</span></li>
                <li><b></b><span>量身定制</span></li>
                <li><b></b><span>领先设计</span></li>
              </ul>
            </div>
          </div>
        </div>
        <div class="tab-show dn">
          <div class="tab-con">
            <div data-animate="fadeInDown" class="txt animated">
              <p>终端以微信为核心载体的微型站点，使其成为移动端的全新信息载体，与微信公众平台无缝对接，展示互动，应有尽用，，让移动网络推广变得更简单。</p>
              <ul class="ul-icon">
                <li><b></b><span>微官网</span></li>
                <li><b></b><span>微信营销</span></li>
                <li><b></b><span>微博营销</span></li>
                <li><b></b><span>手机展示</span></li>
                <li><b></b><span>互动功能</span></li>
                <li><b></b><span>数据同步</span></li>
              </ul>
            </div>
          </div>
        </div>
        <div class="tab-show dn">
          <div class="tab-con">
            <div data-animate="fadeInDown" class="txt animated">
              <p>针对不同行业，提供更多智能功能的微信基础服务系统平台。同时可以根据您的需求进行高级功能定制与开发。</p>
              <ul class="ul-icon">
                <li><b></b><span>微信支付</span></li>
                <li><b></b><span>微信红包</span></li>
                <li><b></b><span>微菜单</span></li>
                <li><b></b><span>微会员系统</span></li>
                <li><b></b><span>微广告推送</span></li>
                <li><b></b><span>微官网</span></li>
              </ul>
            </div>
          </div>
        </div>
      </div>
      <div class="pic">
        <div class="flexslider">
          <ul class="slides">
            <li><img src="/skin/images/14423868578860.jpg" alt="手机网站" class="img"></li>
            <li><img src="/skin/images/14423880884104.jpg" alt="微网站" class="img"></li>
            <li><img src="/skin/images/14423881046487.jpg" alt="微信应用开发" class="img"></li>
          </ul>
        </div>
      </div>
    </div>
  </div>
  <div class="c"></div>
  <div class="service" id="servweb">
    <div class="wp">
      <div class="tit-i tit-i-1">
        <h3>服务流程</h3>
        <h5>service process</h5>
        <em></em> </div>
      <div class="about-info">
        <p style="color:#95959c;"> 我们专业提供一站式服务，从网站品牌规划、视觉设计、<span style="color:#95959C;">交互设计、</span>动效创意，到程序开发，运营维护。<span style="line-height:1.5;">某某网络</span><span style="line-height:1.5;">07</span><span style="line-height:1.5;">年成立到现在</span><span style="line-height:1.5;">8</span><span style="line-height:1.5;">年的时间，我们拥有了丰富的建站经验和运维经验，来保证我们的工作的顺利进行。</span> </p>
        <p style="color:#95959c;">
        <p style="text-align:justify;text-indent:24.0pt;"> <span></span> </p>
        </p>
      </div>
      <div class="process">
        <div class="con">
          <div class="pad"> <img src="/skin/images/process_bg.png" alt="">
            <div class="txt"> <span class="s1">需求</span> <span class="s2">评估</span> <span class="s3">协议</span> <span class="s4">规划</span> <span class="s5">风格沟通</span> <span class="s6">设计</span> <span class="s7">设计修改/确认</span> <span class="s8">前端制作</span> <span class="s9">开发</span> <span class="s10">程序开发</span> <span class="s11">上线</span> <span class="s12">售后服务</span> </div>
            <div class="icon"> <em class="q1"></em> <em class="q2"></em> <em class="q3"></em> <em class="q4"></em> <em class="q5"></em> <em class="q6"></em> <em class="q7"></em> </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="solution" id="solution">
    <div class="wp">
      <div class="tit-i">
        <h3>服务行业</h3>
        <h5>industry solution</h5>
        <em></em> </div>
      <ul class="ul-solution">
        <li class="li1"><a href="javascript:;"><span></span><em>IT行业</em></a></li>
        <li class="li2"><a href="javascript:;"><span></span><em>制造行业</em></a></li>
        <li class="li3"><a href="javascript:;"><span></span><em>服装行业</em></a></li>
        <li class="li4"><a href="javascript:;"><span></span><em>健康行业</em></a></li>
        <li class="li5"><a href="javascript:;"><span></span><em>地产行业</em></a></li>
        <li class="li6"><a href="javascript:;"><span></span><em>美容行业</em></a></li>
        <li class="li7"><a href="javascript:;"><span></span><em>传媒行业</em></a></li>
        <li class="li8"><a href="javascript:;"><span></span><em>家电行业</em></a></li>
        <li class="li9"><a href="javascript:;"><span></span><em>汽车行业</em></a></li>
        <li class="li10"><a href="javascript:;"><span></span><em>烟酒行业</em></a></li>
        <li class="li11"><a href="javascript:;"><span></span><em>教育行业</em></a></li>
        <li class="li12"><a href="javascript:;"><span></span><em>政府机构</em></a></li>
      </ul>
    </div>
  </div>
</div>
<!-- end #bd -->
<div class="c"></div>
<!-- begin #fd --> 
<div id="fd" class="index-fd pr">
  <div class="map-bg3"></div>
  <div class="wp">
    <div class="fd-top">
      <dl>
        <dt>关于我们</dt>
        <dd>
          <ul class="ul-fd">
            <li><a href="/a/guanyuwomen#whous">我们是谁</a></li>
            <li><a href="/a/guanyuwomen#ourcus">我们服务的客户</a></li>
            <!--<li><a href="/a/guanyuwomen#ourteam">我们的团队</a></li>-->
          </ul>
        </dd>
      </dl>
      <dl>
        <dt>我们的服务</dt>
        <dd>
          <ul class="ul-fd">
            <li><a href="/a/fuwuxiangmu#webbuit">网站建设</a></li>
            <li><a href="/a/fuwuxiangmu#weiweb">H5响应式 交互网站</a></li>
            <li><a href="/a/fuwuxiangmu#webmobel">移动端 & 微网站定制</a></li>
            <li><a href="/a/fuwuxiangmu#webmobel">APP定制开发</a></li>
            <li><a href="/a/fuwuxiangmu#servweb">服务流程</a></li>
            <li><a href="/a/fuwuxiangmu#solution">行业解决方案</a></li>
          </ul>
        </dd>
      </dl>
      <dl>
        <dt>我们的案例</dt>
        <dd>
          <ul class="ul-fd">
            
            <li><a href='/a/kehuanli/wangzhansheji/'>网站设计</a></li>
            
            <li><a href='/a/kehuanli/yidongAPP/'>移动APP</a></li>
            
            <li><a href='/a/kehuanli/ruanjianjiemian/'>软件界面</a></li>
            
            <li><a href='/a/kehuanli/hulianwangchanpin/'>互联网产品</a></li>
            
            <li><a href='/a/kehuanli/dianzishangwu/'>电子商务</a></li>
            
            <li><a href='/a/kehuanli/pingmiansheji/'>平面设计</a></li>
            
          </ul>
        </dd>
      </dl>
      <dl>
        <dt>联系我们</dt>
        <dd class="pr">
          <p><a href="" class="weixin"></a><a href="http://weibo.com/u/1876468713?refer_flag=1001030201_" class="sina"></a><span class="weixin-pic"><img src="/skin/images/ewm.png" alt=""></span></p>
          <p><b class="tel">0571-86926263</b></p>
          <h5>公司服务热线</h5>
        </dd>
      </dl>
    </div>
  </div>
<!--  <div class="fd-copy">
    <div class="wp">
      <p> <span style="color:#CCCCCC;">Copyright &copy; 2015-2016 DEDE58.COM 织梦58 版权所有</span><a href="http://www.miibeian.gov.cn/" target="_blank"><span style="color:#CCCCCC;">粤ICP备32652589-1</span></a> </p>
    </div>
  </div>-->
</div>
<div class="side">
  <ul>
    <li><a href="http://wpa.qq.com/msgrd?v=3&uin=2549790462&site=qq&menu=yes" target="_blank">
      <div class="sidebox"><img src="/skin/images/side_icon02.png">在线咨询</div>
      </a></li>
    <li><a href="http://wpa.qq.com/msgrd?v=3&uin=2786449788&site=qq&menu=yes">
      <div class="sidebox"><img src="/skin/images/side_icon01.png">在线咨询</div>
      </a></li>
    <li><a href="javascript:void(0);" >
      <div class="sidebox"><img src="/skin/images/side_icon03.png">0571-86926263</div>
      </a></li>
  </ul>
</div>
<div class="side2">
  <ul>
    <li><a href=""><img src="/skin/images/r_icon1.png" alt=""></a>
      <div class="weixin"><em></em><img src="/skin/images/ewm1.png" alt=""></div>
    </li>
    <li><a href="javascript:goTop();" class="sidetop"><img src="/skin/images/r_icon2.png"></a></li>
  </ul>
</div>
 
<script type="text/javascript" src="/skin/js/jquery.js"></script>
<link rel="stylesheet" href="/skin/css/animate.css" />
<script type="text/javascript" src="/skin/js/lib.js"></script>
<link rel="stylesheet" href="/skin/css/flexslider.css" />
<script type="text/javascript" src="/skin/js/flexslider.js"></script> 
<script>
var progressMove =  false;

function checkMhd(){
isMobile = $('#m-hd').is(':visible');
}

$(window).resize(function(){
var process = $('.process');
checkMhd();
if( isMobile  ){
process.removeClass('animate-box');
}else{
process.addClass('animate-box');
}
}).resize();

$(window).scroll(function(){
showWeb();
showMobilephone();
showProcess();
showSolution();
});

function showWeb(){
if(isScrolledIntoView('.ul-web') ){
$('.ul-web li').each(function(i){
$(this).delay(i*800).fadeIn(50,function(){
$(this).find('img').each(function(j){
$(this).delay(j*200).animate({opacity:1});
})
});
})
}
}

function showProcess(){
if(isScrolledIntoView('.process') ){
$('.process .icon').each(function(){
$(this).find('em').each(function(i){
$(this).delay(i*500).animate({opacity:1});
})
})
}
}



function showMobilephone(){
if( isScrolledIntoView('.tab-show') ){
$('.tab-show .pic').each(function(){
$(this).addClass($(this).data('animate'));
})
$('.tab-show .txt').each(function(){
$(this).addClass($(this).data('animate'));
})
}

}
function showSolution(){
if( isScrolledIntoView('.ul-solution', 300) ){
$(".ul-solution").each(function(){
$(".ul-solution li").animate({left: 0,top: 0,opacity: 1})
})
}
}


$('.ul-webset li a.close').click(function(){
$('.ul-webset li .webset-pop').css({
opacity: 0,
left: '-100%',
zIndex: -1
});
})
$('.webset-pop .li2 a.close').click(function(){
$('.webset-pop').hide();
})
$('.webset-pop .li3 a.close').click(function(){
$('.webset-pop').hide();
})


$('.ul-txt li').click(function(){
var txt = $(this).find('.txt-1');
var _this = this;
if(!txt.is(":visible")){
$('.ul-txt li .txt-1').slideUp(500);
txt.stop(false,true).slideDown(function(){
$('.ul-txt li').removeClass('ok');
$(_this).addClass('ok');
});
}else{
var _this = this;
txt.stop(false,true).slideUp(500,function(){
$('.ul-txt li').removeClass('ok');
});
}
});

$('.ul-webset li .btn').click(function(){
var webset_pop = $(this).parents('li').find('.webset-pop');
webset_pop.css({zIndex: 10}).animate({
opacity: 1,
left: 0
});
});

/*$(".ul-solution li").each(function (index, element) {
if (index % 6 > 1) {
$(this).css({ left: (index % 6 - 1) * 300 / (1 + Math.floor((index) / 6)) * 0.5,opacity: 0 });
} else {
$(this).css({ left: (index % 6 - 2) * 300 / (1 + Math.floor(index / 6)) * 0.5,opacity: 0 });
}
});*/

$(document).ready(function (e) {

$(".ul-solution li").hover(function () {
$(this).find("span").animate({ top: 5}, 300)
}, function () {
$(this).find("span").animate({ top: 0 }, 300)

})
});


$('.web-con .flexslider').flexslider({
animation: "slide",
animationLoop: true,
slideshow: false,
prevText:"",
nextText:"",
controlNav: true,
directionNav: true
});
$(".TAB_CLICK_SLIDE li").click(function(){
var tab = $(this).parent(".TAB_CLICK_SLIDE");
var con = tab.attr("id");
var idx = tab.find("li").index(this);
$(this).addClass('hover').siblings(tab.find("li")).removeClass('hover');
$(con).eq(idx).show().siblings(con).hide();
$('.web-con .flexslider').flexslider(idx);
});


</script>
</body>
</html>